<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>幸运大转盘</title>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			.luckydiv{
				width: 472px;
				margin: 100px auto;
				position: relative;
			}
			.luckydiv img:nth-child(2){
				position: absolute;
				left: 150px;
				top:130px;
			}
			#pic1{
				transition: all 3s;
			}
		</style>
	</head>
	<body>
		<div class="luckydiv">
			<img src="images/zhuanpan.png" id="pic1" />
			<img src="images/wheel_center.png" id="pic2" onclick="choujiang()" />
			<script>
			        var arr = [3600.3690,3780,3870,3645,3645,3645,3645,3645,3645,3645,3645,3645,3645,3645,3645,3645,3645,3645,3645];
			        var index = Math.floor(Math.random()*arr.length);
			        var choujiang = function(){
			        	pic1.style.transform = "rotate("+arr[index]+"deg)"
			        };
			</script>
		</div>
	</body>
</html>
